/* 与布局、排版有关的全局样式名 */
.flex {
  display: flex;
}
//横向 换行
.row-wrap {
  flex-flow: row wrap;
}

/* 垂直居中 */
.flex-vc,
.flex-a-center {
  align-items: center;
}

.flex-a-start {
  align-items: flex-start;
}

.flex-a-end {
  align-items: flex-end;
}

.flex-a-baseline {
  align-items: baseline;
}

.flex-a-stretch {
  align-items: stretch;
}

.flex-hc,
.flex-j-center {
  justify-content: center;
}

.flex-j-between {
  justify-content: space-between;
}

.flex-j-around {
  justify-content: space-around;
}

.flex-j-start {
  justify-content: flex-start;
}

.flex-j-end {
  justify-content: flex-end;
}

.flex-d-column {
  flex-direction: column;
}

.flex1 {
  flex: 1;
}

.vat {
  vertical-align: top;
}

.vab {
  vertical-align: bottom;
}

.vatp {
  vertical-align: text-top;
}

.vatb {
  vertical-align: text-bottom;
}

// hl
.hl22 {
  height: 22px !important;
  line-height: 22px !important;
}

.hl20 {
  height: 20px !important;
  line-height: 20px !important;
}

.hl24 {
  height: 24px !important;
  line-height: 24px !important;
}

.hl34 {
  height: 34px !important;
  line-height: 34px !important;
}

.hl40 {
  height: 40px !important;
  line-height: 40px !important;
}

.hl42 {
  height: 42px !important;
  line-height: 42px !important;
}
